<!--
 * @Description: 
 * @Version: 1.0.1
 * @Autor: hrlu.cn
 * @Date: 2022-06-27 21:44:06
 * @LastEditors: error: git config user.name && git config user.email & please set dead value or install git
 * @LastEditTime: 2022-08-13 22:40:46
-->
{% extends "base.html" %}

{% block cssextend %}
    <link href="/assets/vendor/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="/assets/css/bootstrap-table-custom.css" rel="stylesheet">
{% endblock %}

{% block cssstyle %}
{% endblock %}

{% block content %}
     <!-- DATA TABLE-->
     <section class="p-t-20">
        <div class="container">
            <div class="row">
                <div class="col-sm-12">
                    <div class="statistic-chart-1">
                        <!--h3 class="title-3 m-b-30">Consensus</h3-->
                        
                        <table id="consensus-table" class="table table-hover">
                            <thead>
                                <tr>
                                    <th data-field="scode" data-sortable="true">股票代码</th>
                                    <th data-align="center" data-field="sname" data-sortable="true">股票名称</th>
                                    <th data-align="center" data-field="industry" data-sortable="true">所属行业</th>
                                    <!--th data-align="center" data-field="compute_date" data-sortable="true">计算日期</th-->
                                    <th data-align="center" data-field="forecast_list_length" data-sortable="">参与机构数量</th>
                                    <th data-align="center" data-field="net_profit_fy0" data-sortable="true">净利润</th>
                                    <th data-align="center" data-field="fy1_to_fy0" data-sortable="true">FY1同比</th>
                                    <th data-align="center" data-field="net_profit_fy1" data-sortable="true">FY1净利润</th>
                                    <th data-align="center" data-field="fy2_to_fy1" data-sortable="true">FY2同比</th>
                                    <th data-align="center" data-field="net_profit_fy2" data-sortable="true">FY2净利润</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="" id="consensus-toolbar">
    </div>

    <div class="modal fade" id="detail-modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-wide">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">预测明细</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                </div>
                <div class="modal-body">
                    <table id="consensus-table-detail" class="table table-hover">
                        <thead>
                            <tr>
                                <th data-align="center" data-field="org_name" data-sortable="true">机构名称</th>
                                <th data-align="center" data-field="report_date" data-sortable="true">报告日期</th>
                                <th data-align="center" data-field="quarter" data-sortable="true">预测年度</th>
                                <th data-align="center" data-field="np" data-sortable="true">预测净利润</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block jsextend %}
    <script src="/assets/vendor/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="/assets/vendor/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>

    <script src="/assets/vendor/tableexport/tableExport.min.js"></script>
    <script src="/assets/vendor/bootstrap-table/bootstrap-table-export.min.js"></script>
    <!--script src="/assets/vendor/jspdf/jspdf.min.js"></script>
    <script src="/assets/vendor/jspdf/jspdf.plugin.autotable.js"></script-->
    <script src="/assets/js/echarts.min.js"></script>
{% endblock %}

{% block jsscript %}
<script>
    var updateUrl = function (filter = false) {

        tableOption.url = '/api/consensus_data';
        $('#consensus-table').bootstrapTable('refreshOptions', tableOption);
    }

    var tableOption = {
        url: '/api/consensus_data',
        responseHandler: function (res, jqXHR) {
            for (var idx in res.rows) {
                var row = res.rows[idx];
                row.fy1_to_fy0 = 10000 * row.net_profit_fy1 / row.net_profit_fy0;
                row.fy2_to_fy1 = row.net_profit_fy2 / row.net_profit_fy1;
                row.forecast_list_length = row.forecast_list.length;

                ['net_profit_fy0'].forEach(function (field) {
                    row[field] = digitFormatter(row[field], 'CNY');
                });

                ['net_profit_fy1', 'net_profit_fy2',].forEach(function (field) {
                    row[field] = digitFormatter(row[field] * 10000, 'CNY');
                });

                ['fy1_to_fy0', 'fy2_to_fy1'].forEach(function (field) {
                    row[field] = digitFormatter(row[field], 'percentage');
                });
                
                for (var idx in row.forecast_list) {
                    var detail = row.forecast_list[idx];
                    
                    detail.report_date = detail.report_date.substr(0, 4) + '-' + detail.report_date.substr(4, 2) + '-' + detail.report_date.substr(6, 2);
                    detail.np = digitFormatter(detail.np * 10000, 'CNY');
                }
            }
            return res;
        },
        onClickRow: function (row, elem, field) {
            detailTableOption.data = row.forecast_list;
            $('#consensus-table-detail').bootstrapTable('refreshOptions', detailTableOption);
            
            $('#detail-modal').modal('toggle');
        },
        align: 'center',
        search: true,
        showRefresh: true,
        showColumns: true,
        iconSize: 'sm',

        classes: 'table',
        toolbar: '#consensus-toolbar',

        sortable: true,
        serverSort: true,

        pagination: true,
        sidePagination: 'server',
        pageSize: 10,
        pageList: [10, 20, 50, 100, 1000],

        showExport: true,
        exportDataType: '',
        exportTypes: ['json', 'csv', 'txt', 'sql', 'excel'], //  'pdf', 'xml', 
    };

    var detailTableOption = {
        data: [],
        align: 'center',
        classes: 'table',
        iconSize: 'sm',

        pagination: true,
        pageSize: 10,
        pageList: [10, 20, 50, 100, 1000],
    };

    $('#quarterSelect').change(updateUrl);

    $('#consensus-table').bootstrapTable(tableOption);
    $('#consensus-table-detail').bootstrapTable(detailTableOption);

    $('.quarter-btn').click(function (){
        $('#quarter-dropdown').text($(this).text());
        $('#indicator-display').text($('#indicators-dropdown').val()+$('#quarter-dropdown').text());
    });

    searchInputPopover();

</script>
{% endblock %}